<!-- 预约 -->
<div class="wrapper">
	<!-- second-nav -->
	<!-- <div ng-include="'main/recruit/nav.html'"></div> -->
	<!-- wrapper-content -->
	<section class="wrapper-content">
		<div class="container-fluid">
			<h2 class="content-title"><span class="margin-right-10">预约到访</span><small>预约到访列表</small></h2>
		</div>
		<!-- btn-row -->
		<div class="btn-row clearfix">
			<div class="col-md-6">
				<button class="btn btn-primary" ng-click="openAdd()">添加</button>
			</div>
		</div>
		<!-- select-row -->
		<div class="row">
			<div class="container-fluid">
				<div class="form-horizontal">
					<div class="form-group">
						<div class="col-md-6">
							<div class="control-label col-md-4">
							    <label for="">到访时间</label>
							</div>
							<div class="col-md-8">
								<my-daterangepicker default="" min-date="" date-limit="10000" max-date="" ng-model="filter.trackDate" ng-change="selectTrackDate()"></my-daterangepicker>
							</div>
						</div>
						<div class="col-md-6">
							<div class="control-label col-md-4">
							    <label for="">邀约人</label>
							</div>
							<div class="col-md-8">
								<select class="form-control" ng-model="select.owner" ng-options="item.name for item in userList" ng-change="selectOwner()">
									<option value="">全部</option>
								</select>
							</div>
						</div>
					</div>
					<div class="form-group">
						<div class="col-md-6">
							<div class="control-label col-md-4">
							    <label for="">意向班型</label>
							</div>
							<div class="col-md-8">
								<select class="form-control" ng-model="select.classTypeId" ng-options="item.name for item in classTypeList" ng-change="selectClassTypeId()">
									<option value="">全部</option>
								</select>
							</div>
						</div>
						<div class="col-md-6">
							<div class="control-label col-md-4">
							    <label for="">状态</label>
							</div>
							<div class="col-md-8">
								<select class="form-control" ng-model="select.status" ng-options="item.name for item in classTypeList" ng-change="selectStatus()">
									<option value="">全部</option>
								</select>
							</div>
						</div>
					</div>
					<div class="form-group">
						<div class="col-md-6">
							<div class="control-label col-md-4">
							    <label for="">关键字</label>
							</div>
							<div class="col-md-8">
								<div class="input-group">
							        <input id="keyword" name="keyword" class="form-control" type="text" placeholder="潜在生\招生活动\联系电话" ng-model="filter.keyword">
							        <span class="input-group-addon" ng-click="search()"><i class="fa fa-search" aria-hidden="true"></i></span>
							    </div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>

		<!-- ng-table-row -->
		<div class="row">
			<div class="container-fluid">
				<div class="col-md-12">
					<table class="table table-bordered" ng-table="appointmentList">
						<tr ng-repeat="item in $data">
							<td title="'操作'" class="text-center">
								<div class="btn-group btn-group-sm text-nowrap">
									<button type="button" class="btn btn-default btn-sm dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="fa fa-bars" aria-hidden="true"></i></button>
                                    <ul class="dropdown-menu">
                                        <li><a href="javascript:void(0);" ng-click="openEdit(item);" class="" title="编辑预约记录"><span><i class="fa fa-pencil text-success"></i> 编辑预约记录</span></a></li>
                                        <li><a href="javascript:void(0);" ng-click="openCreate(item);" class="" title="创建沟通记录"><span><i class="fa fa-phone-square text-primary"></i>创建沟通记录</span></a></li>
                                        <li><a href="javascript:void(0);" ng-click="openDel(item);" class="" title="删除"><span><i class="fa fa-times text-warning"></i> 删除</span></a></li>
                                    </ul>
                                </div>
							</td>
							<td title="'潜在生'" sortable="'name'">{{item.inquiry.name}}</td>
							<td title="'联系电话'" sortable="'mobile'">{{item.inquiry.mobile}}</td>
							<td title="'意向班级'" sortable="'classTypeId'">{{item.inquiry.classTypeId.name}}</td>
							<td title="'邀约人'" sortable="'owner'">{{item.owner.name}}</td>
							<td title="'邀约目的'" sortable="'purposeId'">{{item.purposeId.name}}</td>
							<td title="'招生活动'" sortable="'event'">{{item.event.name}}</td>
							<td title="'到访时间'" sortable="'visitTime'">{{item.visitTime}}</td>
							<td title="'状态'" sortable="'status'">{{item.status.name}}</td>
							<td title="'跟进情况'" sortable="'progressNotes'">{{item.inquiry.progressNotes}}</td>
							<td title="'备注及反馈'" sortable="'notes'">{{item.notes}}</td>
						</tr>
					</table>
					<div class="row">
						<div class="col-md-6">
							<div class="pull-left btn btn-default">总数：<span class="badge">{{ totalRow }}</span></div>	
						</div>
						<div class="col-md-6">
							<!-- 分页 -->
							<nav>
								<ul class="pagination ng-table-pagination fr">
									<li>
										<a ng-click="previous()"><span>上一页</span></a>
									</li>
									<li ng-repeat="page in pageList" ng-class="{active: isActivePage(page)}" >
										<a ng-click="getAppointmentList(page)">{{ page }}</a>
									</li>
									<li>
										<a ng-click="next()"><span>下一页</span></a>
									</li>
								</ul>
							</nav>
						</div>
					</div>
				</div>
			</div>
		</div>

		<!-- 删除 delModel -->
		<div class="modal" id="delModel" tabindex="-1" role="dialog">
			<div class="modal-dialog" role="document">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        				<h3 class="modal-title">删除</h3>
					</div>
					<div class="modal-body">
						<p class="text-danger text-center">删除将造成相关数据丢失，请确认是否继续删除。</p>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-primary" ng-click="delAppointment()">确认</button>
						<button type="button" class="btn btn-warning" data-dismiss="modal">取消</button>
					</div>
				</div>
			</div>
		</div>
		
		<!-- 新增/修改 model -->
		<div class="modal" id="formModel" tabindex="-1" role="dialog" aria-labelledby="formModel" aria-hidden="true">
			<div class="modal-dialog modal-lg" role="document">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        				<h3 class="modal-title">{{form.title}}</h3>
					</div>
					<div class="modal-body">
						<div class="form-horizontal">
							<!-- 跟进目的 -->
							<div class="form-group">
								<div class="control-label col-md-4">
								    <span ng-show="false" class="text-danger">*</span>
								    <label for="purpose">招生活动</label>
								</div>
								<div class="col-md-6">
									<ui-select ng-model="form.item.eventId" ng-change="selectProvince()">
										<ui-select-match placeholder="选择...">
											<span>{{$select.selected.name}}</span>
										</ui-select-match>
										<ui-select-choices repeat="item in form.eventList | filter: $select.search">
											<div ng-bind="item.name"></div>
										</ui-select-choices>
									</ui-select>
								</div>
								<div class="col-md-2 text-danger" ng-bind="form.item.warn.eventId"></div>
							</div>
							<!-- 潜在生 -->
							<div class="form-group">
								<div class="control-label col-md-4">
								    <span ng-show="true" class="text-danger">*</span>
								    <label for="inquiryId">潜在生</label>
								</div>
								<div class="col-md-6">
									<div class="input-group">
										<div class="" style="width:100%">
											<div title="点击选择" class="list-group-item text-right" style="padding:0px;">
												<div class="pull-left label label-primary" style="margin:6px;" ng-repeat="node in form.item.inquiryId">
													<span style="color:white;">
														<span>{{node.name}}</span>
														<a style="color:white;margin-left:5px;" href="javascript:void(0)" ng-click="selectedRemove(node)"><i class="fa fa-times"></i></a>
													</span>
												</div>
												<span class="input-group-btn">
													<button ng-click="openSelect()" ng-disabled="option.disabled" class="btn btn-link" type="button"><i class="fa fa-list-alt"></i></button>
												</span>
												<div class="clearfix"></div>
											</div>
										</div>
									</div>
								</div>
								<div class="col-md-2 text-danger" ng-bind="form.item.warn.inquiryId"></div>
							</div>
							<!-- 邀约人 -->
							<div class="form-group">
								<div class="control-label col-md-4">
								    <span ng-show="true" class="text-danger">*</span>
								    <label for="owner">邀约人</label>
								</div>
								<div class="col-md-6">
									<select id="owner" class="form-control" ng-model="form.item.owner" ng-options="item.name for item in form.userList" ng-change="watchOwner()"></select>
								</div>
								<div class="col-md-2 text-danger" ng-bind="form.item.warn.owner"></div>
							</div>
							<!-- 到访时间 -->
							<div class="form-group">
								<div class="control-label col-md-4">
								    <span ng-show="false" class="text-danger">*</span>
								    <label for="visitTime">到访时间</label>
								</div>
								<div class="col-md-6">
									<my-datetimepicker name="visitTime" ng-model-options=" {getterSetter: true }" ng-model="form.item.visitTime" max-date="" min-date=""></my-datetimepicker>
								</div>
								<div class="col-md-2 text-danger" ng-bind="form.item.warn.visitTime"></div>
							</div>
							<!-- 邀约目的 -->
							<div class="form-group">
								<div class="control-label col-md-4">
								    <span ng-show="false" class="text-danger">*</span>
								    <label for="purpose">邀约目的</label>
								</div>
								<div class="col-md-6">
									<select id="purpose" class="form-control" ng-model="form.item.purposeId" ng-options="item.name for item in form.purposeList">
										<option value="">--请选择--</option>
									</select>
								</div>
								<div class="col-md-2 text-danger" ng-bind="form.item.warn.purpose"></div>
							</div>
							<!-- 状态 -->
							<div class="form-group">
								<div class="control-label col-md-4">
								    <span ng-show="false" class="text-danger">*</span>
								    <label for="status">状态</label>
								</div>
								<div class="col-md-6">
									<select id="status" class="form-control" ng-model="form.item.status" ng-options="item.name for item in form.statusList"></select>
								</div>
								<div class="col-md-2 text-danger" ng-bind="form.item.warn.status"></div>
							</div>
							<!-- 反馈 -->
							<div class="form-group">
								<div class="control-label col-md-4">
								    <span ng-show="true" class="text-danger">*</span>
								    <label for="notes">反馈</label>
								</div>
								<div class="col-md-6">
									<textarea name="" class="form-control" ng-model="form.item.feedback"></textarea>
								</div>
								<div class="col-md-2 text-danger" ng-bind="form.item.warn.feedback"></div>
							</div>
							<!-- 备注 -->
							<div class="form-group">
								<div class="control-label col-md-4">
								    <span ng-show="true" class="text-danger">*</span>
								    <label for="notes">备注</label>
								</div>
								<div class="col-md-6">
									<textarea name="" class="form-control" ng-model="form.item.notes"></textarea>
								</div>
								<div class="col-md-2 text-danger" ng-bind="form.item.warn.notes"></div>
							</div>
						</div>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-primary" ng-click="form.submit()">提交</button>
						<button type="button" class="btn btn-warning" data-dismiss="modal">取消</button>
					</div>
				</div>
			</div>
		</div>
		
		<!-- 潜在生弹层 -->
		<div class="modal" id="selectModel" tabindex="-1" role="dialog" aria-labelledby="selectModel" aria-hidden="true">
			<div class="modal-dialog modal-lg" role="document">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" ng-click="close('#selectModel')" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        				<h3 class="modal-title">潜在生</h3>
					</div>
					<div class="modal-body">
						<!-- search -->
						<div class="row margin-bottom-10">
							<div class="col-md-1"><label class="control-label">查询：</label></div>
							<div class="col-md-4">
								<input placeholder="搜索..." class="form-control" type="text" ng-model="form.inquiry.inquiryKeyword">
							</div>
							<div class="col-md-2"><button class="btn btn-primary" ng-click="searchByInquiryKeyword()">搜索</button></div>
						</div>
						<!-- table -->
						<table class="table table-bordered table-hover" ng-table="inquiryList">
							<tr ng-class="item.isSelected ? 'success' : '' " ng-repeat="item in $data" ng-click="selectItem(item)">
								<td title="'姓名'">{{item.name}}</td>
								<td title="'小名'">{{item.nickName}}</td>
								<td title="'家长姓名'">{{item.parentName}}</td>
								<td title="'联系电话'">{{item.mobile}}</td>
							</tr>
						</table>
						<div class="row">
							<div class="col-md-6">
								<div class="pull-left btn btn-default">总数：<span class="badge">{{ form.inquiry.totalRow }}</span></div>	
							</div>
							<div class="col-md-6">
								<!-- 分页 -->
								<nav>
									<ul class="pagination ng-table-pagination fr">
										<li>
											<a ng-click="previous('inquiry')"><span>上一页</span></a>
										</li>
										<li ng-repeat="page in form.inquiry.pageList" ng-class="{active: isActivePage(page, 'inquiry')}" >
											<a ng-click="getInquiryList(page)">{{ page }}</a>
										</li>
										<li>
											<a ng-click="next('inquiry')"><span>下一页</span></a>
										</li>
									</ul>
								</nav>
							</div>
						</div>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-primary" ng-click="submitSelect()" ng-disabled="form.inquiry.allowSubmit">确认</button>
						<button type="button" class="btn btn-warning" ng-click="close('#selectModel')">取消</button>
					</div>
				</div>
			</div>
		</div>
		<!-- 创建沟通记录 -->
		<div class="modal" id="createModel" tabindex="-1" role="dialog" aria-labelledby="createModel" aria-hidden="true">
			<div class="modal-dialog modal-lg" role="document">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        				<h3 class="modal-title">新建追踪</h3>
					</div>
					<div class="modal-body">
						<div class="form-horizontal">
							<div class="form-group">
								<!-- 跟进目的 -->
								<div class="col-md-6">
									<div class="control-label col-md-4">
									    <span ng-show="true" class="text-danger">*</span>
									    <label for="purpose">跟进目的</label>
									</div>
									<div class="col-md-8">
										<div><input id="purpose" name="purpose" class="form-control" placeholder="跟进目的" type="text" ng-model="traceItem.purpose"  ng-change="watchPurpose()"></div>
										<div class="text-danger" ng-bind="traceItem.warn.purpose"></div>
									</div>
								</div>
								<!-- 跟进日期 -->
								<div class="col-md-6">
									<div class="control-label col-md-4">
									    <span ng-show="true" class="text-danger">*</span>
									    <label for="trackDate">跟进日期</label>
									</div>
									<div class="col-md-8">
										<my-datepicker name="trackDate" ng-model-options="{getterSetter: true }" ng-model="traceItem.trackDate" max-date="" min-date=""  ng-change="watchTrackDate()"></my-datepicker>
										<div class="text-danger" ng-bind="traceItem.warn.trackDate"></div>
									</div>
								</div>
							</div>
							<div class="form-group">			
								<!-- 跟进进展 -->
								<div class="col-md-6">
									<div class="control-label col-md-4">
									    <span ng-show="true" class="text-danger">*</span>
									    <label for="notes">跟进进展</label>
									</div>
									<div class="col-md-8">
										<textarea name="" class="form-control" ng-model="traceItem.notes" ng-change="watchNotes()"></textarea>
										<div class="text-danger" ng-bind="traceItem.warn.notes"></div>
									</div>
								</div>
								<!-- 计划下次跟进日期 -->
								<div class="col-md-6">
									<div class="control-label col-md-4">
									    <span ng-show="false" class="text-danger">*</span>
									    <label for="planNextTrackDate">计划下次跟进日期</label>
									</div>
									<div class="col-md-8">
										<my-datetimepicker name="planNextTrackDate" ng-model-options=" {getterSetter: true }" ng-model="traceItem.planNextTrackDate" max-date="" min-date="" ng-change="watchPlanNextTrackDate()"></my-datetimepicker>
										<div class="text-danger" ng-bind="traceItem.warn.planNextTrackDate"></div>
									</div>
								</div>
							</div>
							<div class="form-group">
								<div class="col-md-6">
									<div class="col-md-4"></div>
									<div class="col-md-8">
										<button class="btn btn-primary" ng-click="createTrace()">确认</button>
									</div>
								</div>
							</div>
						</div>

						<!-- table -->
						<table class="table table-bordered" ng-table="traceList">
							<tr ng-repeat="item in $data">
								<td title="'跟进人'" sortable="'createBy'">{{item.createBy.name}}</td>
								<td title="'跟进目的'" sortable="'purpose'">{{item.purpose}}</td>
								<td title="'跟进日期'" sortable="'trackDate'">{{item.trackDate}}</td>
								<td title="'计划下次跟进日期'" sortable="'planNextTrackDate'">{{item.planNextTrackDate}}</td>
								<td title="'跟进进展'" sortable="'notes'">{{item.notes}}</td>
							</tr>
						</table>
						<div class="row">
							<div class="col-md-6">
								<div class="pull-left btn btn-default">总数：<span class="badge">{{ form.trace.totalRow }}</span></div>	
							</div>
							<div class="col-md-6">
								<!-- 分页 -->
								<nav>
									<ul class="pagination ng-table-pagination fr">
										<li>
											<a ng-click="previous('trace')"><span>上一页</span></a>
										</li>
										<li ng-repeat="page in form.trace.pageList" ng-class="{active: isActivePage(page, 'trace')}" >
											<a ng-click="getTraceList(page)">{{ page }}</a>
										</li>
										<li>
											<a ng-click="next('trace')"><span>下一页</span></a>
										</li>
									</ul>
								</nav>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<!-- 提示 infoModel -->
		<info-modal msg="msg" visible="visible"></info-modal>
	</section>
</div>